<template>
    <div class="contain">
        <div class="loader-base" v-if="showLoad"><div class="loader-wrap"></div></div>
        <div class="page">
            <div class="form-box displayflex">
                <div class="label">购票费</div>
                <div class="ctx flex1">
                    <input type="number" class="txt-rit" placeholder="请输入" v-model="ticketFee">
                </div>
                <i class="rit">元</i>
            </div>
            <div class="form-wrap2 mb20">
                <p class="txt">购票凭证</p>
                <uploader-imgs :word="'长途票据'" v-model="picJson" :list="picJson"></uploader-imgs>
            </div>
        </div>
        <div class="btn-bottom"><div class="btn" @click="submit">保存</div></div>
    </div>
</template>

<script>
import uploaderImgs from "@/components/share/NewUploaders.vue";
export default {
    components: {
        uploaderImgs
    },
    data() {
        return {
            todolist: [],
            showLoad: false,
            picJson: {
                imgLista: [],
                imgListBase: []
            },
            ticketFee: null,
        };
    },
    computed: {
        userinfo() {
            if (localStorage.UserInfo) {
                return JSON.parse(localStorage.UserInfo);
            }
        },
    },
    created() {
        this.getData();
    },
    methods: {
        getData(){
            this.showLoad = true;
            var query = {
                    Guid: this.$route.query.id
                },
                self = this;
            this.Ajax.post("GetOrderDetail", query).then(function(resp) {
                self.showLoad = false;
                self.todolist = resp.Data.Main;
                if(self.todolist.BusTicketAmount > 0)
                {
                    self.ticketFee = self.todolist.BusTicketAmount;
                    self.picJson.imgLista = JSON.parse(self.todolist.BusTicketPic);
                }
            });
        },
        submit(){
            var self = this,
                imglist = [],
                androidlist = [];

            for(var i = 0; i < self.picJson.imgLista.length; i++)
            {
                var item = self.picJson.imgLista[i];
                if(item.indexOf('base64') > -1)
                {
                    if (window.__wxjs_is_wkwebview) {
                        var imgbase64 = item.substr(item.indexOf("base64") + 7, item.length);
                        item = imgbase64;
                    }
                }
                imglist.push(item);
            }

            if (navigator.userAgent.indexOf("Android") > -1)
            {
                for(var k = 0; k < imglist.length; k++)
                {
                    if(imglist[k].indexOf('File') > -1)
                    {
                        androidlist.push(imglist[k]);
                    }
                }
                androidlist = androidlist.concat(self.picJson.imgListBase);
                imglist = androidlist;
            }

            // for(var i = 0; i < imglist.length; i++)
            // {
            //     alert('imglist###' + i + '=======>' + JSON.stringify(imglist[i]))
            // }
            
            // imglist.push('iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNzY5YmUyMy1mNmQ3LTk4NGEtOGU3OS1jNzY2OWYzNWI1NDAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTAwMzAwNzY1RkY2MTFFODk4MjBEQjNCMEVGNEREMkEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTAwMzAwNzU1RkY2MTFFODk4MjBEQjNCMEVGNEREMkEiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTc2OWJlMjMtZjZkNy05ODRhLThlNzktYzc2NjlmMzViNTQwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE3NjliZTIzLWY2ZDctOTg0YS04ZTc5LWM3NjY5ZjM1YjU0MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PviVBQkAAAAGUExURTOF/wAAAICK9d8AAAAMSURBVHjaYmAACDAAAAIAAU9tWeEAAAAASUVORK5CYII=')
            
            if(!this.ticketFee || this.ticketFee == 0) {
                this.$vux.toast.show({
                    type: "warn", //success, warn, cancel, text
                    text: "购票费不能为空"
                });
                return false;
            };

            if (imglist.length == 0) {
                this.$vux.toast.show({
                    type: "warn", //success, warn, cancel, text
                    text: "请上传票据凭证，并确保价格日期起止地等信息清晰可见",
                    time:2000,
                });
                return false;
            };

            this.showLoad = true;
            var query = {
                    Guid: self.todolist.Guid,
                    BusTicketAmount: self.ticketFee,
                    TicketImgUrlList: imglist,
                    // TicketImgUrlOrgList: self.picJson.imgLista,
                };
  
            // query.TicketImgUrlList = [];
            // query.TicketImgUrlList.push("iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozODJlMjE3Yy1jZmIwLWMzNDktYjQ2OS02Yjg2YmY4OTk2N2YiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTAyNTYzQTE0MkYwMTFFOEIxMjlCRTVCMUU3MUIxQzEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTAyNTYzQTA0MkYwMTFFOEIxMjlCRTVCMUU3MUIxQzEiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MzgyZTIxN2MtY2ZiMC1jMzQ5LWI0NjktNmI4NmJmODk5NjdmIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjM4MmUyMTdjLWNmYjAtYzM0OS1iNDY5LTZiODZiZjg5OTY3ZiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PobFmnMAAAAOSURBVHjaYvrPwAAQYAADCQEC3owWcQAAAABJRU5ErkJggg==")
            // query.TicketImgUrlList.push("iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNzY5YmUyMy1mNmQ3LTk4NGEtOGU3OS1jNzY2OWYzNWI1NDAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTAwMzAwNzY1RkY2MTFFODk4MjBEQjNCMEVGNEREMkEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTAwMzAwNzU1RkY2MTFFODk4MjBEQjNCMEVGNEREMkEiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTc2OWJlMjMtZjZkNy05ODRhLThlNzktYzc2NjlmMzViNTQwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE3NjliZTIzLWY2ZDctOTg0YS04ZTc5LWM3NjY5ZjM1YjU0MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PviVBQkAAAAGUExURTOF/wAAAICK9d8AAAAMSURBVHjaYmAACDAAAAIAAU9tWeEAAAAASUVORK5CYII=")
            // iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkZGQTNEQURDNUZGNjExRThCRjdFQkM4OTFBM0M4QkJDIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkZGQTNEQURENUZGNjExRThCRjdFQkM4OTFBM0M4QkJDIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RkZBM0RBREE1RkY2MTFFOEJGN0VCQzg5MUEzQzhCQkMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkZBM0RBREI1RkY2MTFFOEJGN0VCQzg5MUEzQzhCQkMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4006srAAAABlBMVEUAAAD///+l2Z/dAAAADElEQVR42mJgAAgwAAACAAFPbVnhAAAAAElFTkSuQmCC
            
            this.Ajax.post("OperateBusTicket", query).then(function(resp) {
                self.showLoad = false;
                if(resp.IsSuccess) {
                    self.$vux.toast.show({
                        type: "success", //success, warn, cancel, text
                        text: "保存完成",
                        onHide() {
                            self.$router.push({
                                path: "/allList",
                                query: {gostate : self.$route.query.gostate}
                            });
                        }
                    });
                } else {
                    self.$vux.toast.show({
                        type: "warn", //success, warn, cancel, text
                        text: resp.ErrorMessage,
                        onHide() {
                            self.$router.push({
                                path: "/allList",
                                query: {gostate : self.$route.query.gostate}
                            });
                        }
                    });
                }
            });
        }
    }
}
</script>